קומבינטורי פרסור עם Template Literals ב-TypeScript: ניתוח טיפוסי מחרוזות מורכבים

ה-Template Literals של TypeScript, בשילוב עם טיפוסים מותנים והסקת טיפוסים (type inference), מספקים כלים רבי עוצמה למניפולציה וניתוח של טיפוסי מחרוזות בזמן קומפילציה. פוסט בלוג זה בוחן כיצד לבנות קומבינטורי פרסור (parser combinators) באמצעות תכונות אלו כדי לטפל במבני מחרוזות מורכבים, ובכך לאפשר אימות והמרת טיפוסים חזקים בפרויקטים שלכם ב-TypeScript.

מבוא לטיפוסי Template Literal

טיפוסי Template Literal מאפשרים לכם להגדיר טיפוסי מחרוזות המכילים ביטויים משובצים. ביטויים אלו מחושבים בזמן קומפילציה, מה שהופך אותם לשימושיים להפליא ליצירת כלי עזר בטוחים למניפולציה של מחרוזות.

לדוגמה:

            type Greeting<T extends string> = `Hello, ${T}!`;

type MyGreeting = Greeting<"World">; // Type is "Hello, World!"

            

              
                Copy
              
            
          

דוגמה פשוטה זו מדגימה את התחביר הבסיסי. הכוח האמיתי טמון בשילוב של Template Literals עם טיפוסים מותנים והסקה.

טיפוסים מותנים והסקה (Inference)

טיפוסים מותנים ב-TypeScript מאפשרים לכם להגדיר טיפוסים התלויים בתנאי. התחביר דומה לאופרטור טרנרי: `T extends U ? X : Y`. אם `T` ניתן להשמה ל-`U`, אז הטיפוס הוא `X`; אחרת, הוא `Y`.

הסקת טיפוסים, באמצעות מילת המפתח `infer`, מאפשרת לחלץ חלקים ספציפיים מטיפוס. זה שימושי במיוחד כאשר עובדים עם טיפוסי Template Literal.

שקלו את הדוגמה הבאה:

            type GetParameterType<T extends string> = T extends `(param: ${infer P}) => void` ? P : never;

type MyParameterType = GetParameterType<'(param: number) => void'>; // Type is number

            

              
                Copy
              
            
          

כאן, אנו משתמשים ב-`infer P` כדי לחלץ את הטיפוס של הפרמטר מתוך טיפוס פונקציה המיוצג כמחרוזת.

קומבינטורי פרסור: אבני בניין לניתוח מחרוזות

קומבינטורי פרסור הם טכניקה של תכנות פונקציונלי לבניית פרסורים (parsers). במקום לכתוב פרסור יחיד ומונוליתי, אתם יוצרים פרסורים קטנים יותר, הניתנים לשימוש חוזר, ומשלבים אותם כדי לטפל בדקדוקים מורכבים יותר. בהקשר של מערכות הטיפוסים של TypeScript, ה'פרסורים' הללו פועלים על טיפוסי מחרוזות.

נגדיר כמה קומבינטורי פרסור בסיסיים שישמשו כאבני בניין לפרסורים מורכבים יותר. דוגמאות אלו מתמקדות בחילוץ חלקים ספציפיים ממחרוזות בהתבסס על תבניות מוגדרות.

קומבינטורים בסיסיים

`StartsWith<T, Prefix>`

בודק אם טיפוס מחרוזת `T` מתחיל בקידומת נתונה `Prefix`. אם כן, הוא מחזיר את החלק הנותר של המחרוזת; אחרת, הוא מחזיר `never`.

            type StartsWith<T extends string, Prefix extends string> = T extends `${Prefix}${infer Rest}` ? Rest : never;

type Remaining = StartsWith<"Hello, World!", "Hello, ">; // Type is "World!"

type Never = StartsWith<"Hello, World!", "Goodbye, ">; // Type is never

            

              
                Copy
              
            
          

`EndsWith<T, Suffix>`

בודק אם טיפוס מחרוזת `T` מסתיים בסיומת נתונה `Suffix`. אם כן, הוא מחזיר את החלק של המחרוזת שלפני הסיומת; אחרת, הוא מחזיר `never`.

            type EndsWith<T extends string, Suffix extends string> = T extends `${infer Rest}${Suffix}` ? Rest : never;

type Before = EndsWith<"Hello, World!", "!">; // Type is "Hello, World"

type Never = EndsWith<"Hello, World!", ".">; // Type is never

            

              
                Copy
              
            
          

`Between<T, Start, End>`

מחלץ את החלק של המחרוזת שנמצא בין התוחמים `Start` ו-`End`. מחזיר `never` אם התוחמים אינם נמצאים בסדר הנכון.

            type Between<T extends string, Start extends string, End extends string> = StartsWith<T, Start> extends never ? never : EndsWith<StartsWith<T, Start>, End>;

type Content = Between<"<div>Content</div>", "<div>", "</div>">; // Type is "Content"

type Never = Between<"<div>Content</span>", "<div>", "</div>">; // Type is never

            

              
                Copy
              
            
          

שילוב קומבינטורים

הכוח האמיתי של קומבינטורי פרסור מגיע מהיכולת לשלב אותם. בואו ניצור פרסור מורכב יותר שמחלץ את הערך ממאפיין סגנון CSS.

`ExtractCSSValue<T, Property>`

פרסור זה מקבל מחרוזת CSS `T` ושם מאפיין `Property` ומחלץ את הערך המתאים. הוא מניח שמחרוזת ה-CSS היא בפורמט `property: value;`.

            type ExtractCSSValue<T extends string, Property extends string> = Between<T, `${Property}: `, ";">;

type ColorValue = ExtractCSSValue<"color: red; font-size: 16px;", "color">; // Type is "red"

type FontSizeValue = ExtractCSSValue<"color: blue; font-size: 12px;", "font-size">; // Type is "12px"

            

              
                Copy
              
            
          

דוגמה זו מראה כיצד נעשה שימוש ב-`Between` כדי לשלב את `StartsWith` ו-`EndsWith` באופן מרומז. אנו למעשה מנתחים את מחרוזת ה-CSS כדי לחלץ את הערך המשויך למאפיין שצוין. ניתן להרחיב זאת כדי לטפל במבני CSS מורכבים יותר עם כללים מקוננים וקידומות ספקים (vendor prefixes).

דוגמאות מתקדמות: אימות והמרת טיפוסי מחרוזות

מעבר לחילוץ פשוט, ניתן להשתמש בקומבינטורי פרסור לאימות והמרה של טיפוסי מחרוזות. בואו נבחן כמה תרחישים מתקדמים.

אימות כתובות אימייל

אימות כתובות אימייל באמצעות ביטויים רגולריים בטיפוסים של TypeScript הוא מאתגר, אך אנו יכולים ליצור אימות פשוט באמצעות קומבינטורי פרסור. שימו לב שזה אינו פתרון אימות אימייל מלא, אלא מדגים את העיקרון.

            type IsEmail<T extends string> = T extends `${infer Username}@${infer Domain}.${infer TLD}` ? (
  Username extends '' ? never : (
    Domain extends '' ? never : (
      TLD extends '' ? never : T
    )
  )
) : never;

type ValidEmail = IsEmail<"test@example.com">; // Type is "test@example.com"

type InvalidEmail = IsEmail<"test@example">; // Type is never

type AnotherInvalidEmail = IsEmail<"@example.com">; // Type is never

            

              
                Copy
              
            
          

טיפוס `IsEmail` זה בודק את נוכחותם של `@` ו-`.` ומוודא ששם המשתמש, הדומיין והסיומת העליונה (TLD) אינם ריקים. הוא מחזיר את מחרוזת האימייל המקורית אם היא תקינה, או `never` אם אינה תקינה. פתרון חזק יותר יכול לכלול בדיקות מורכבות יותר על התווים המותרים בכל חלק של כתובת האימייל, ואולי להשתמש בטיפוסי בדיקה (lookup types) כדי לייצג תווים חוקיים.

המרת טיפוסי מחרוזות: המרה ל-Camel Case

המרת מחרוזות ל-camel case היא משימה נפוצה. אנו יכולים להשיג זאת באמצעות קומבינטורי פרסור והגדרות טיפוסים רקורסיביות. זה דורש גישה מעט יותר מורכבת.

            type CamelCase<T extends string> = T extends `${infer FirstWord}_${infer SecondWord}${infer Rest}`
  ? `${FirstWord}${Capitalize<SecondWord>}${CamelCase<Rest>}`
  : T;

type Capitalize<S extends string> = S extends `${infer First}${infer Rest}` ? `${Uppercase<First>}${Rest}` : S;

type MyCamelCase = CamelCase<"my_string_to_convert">; // Type is "myStringToConvert"

            

              
                Copy
              
            
          

הנה פירוט: * `CamelCase<T>`: זהו הטיפוס הראשי שממיר באופן רקורסיבי מחרוזת ל-camel case. הוא בודק אם המחרוזת מכילה קו תחתון (`_`). אם כן, הוא הופך את האות הראשונה של המילה הבאה לגדולה (capitalize) וקורא רקורסיבית ל-`CamelCase` על שאר המחרוזת. * `Capitalize<S>`: טיפוס עזר זה הופך את האות הראשונה של מחרוזת לגדולה. הוא משתמש ב-`Uppercase` כדי להמיר את התו הראשון לאות גדולה.

דוגמה זו מדגימה את העוצמה של הגדרות טיפוסים רקורסיביות ב-TypeScript. היא מאפשרת לנו לבצע המרות מחרוזות מורכבות בזמן קומפילציה.

ניתוח CSV (ערכים מופרדים בפסיק)

ניתוח נתוני CSV הוא תרחיש מורכב יותר מהעולם האמיתי. בואו ניצור טיפוס שמחלץ את הכותרות ממחרוזת CSV.

            type CSVHeaders<T extends string> = T extends `${infer Headers}\n${string}` ? Split<Headers, ','> : never;

type Split<T extends string, Separator extends string> = T extends `${infer Head}${Separator}${infer Tail}`
  ? [Head, ...Split<Tail, Separator>]
  : [T];

type MyCSVHeaders = CSVHeaders<"header1,header2,header3\nvalue1,value2,value3">; // Type is ["header1", "header2", "header3"]

            

              
                Copy
              
            
          

דוגמה זו משתמשת בטיפוס עזר `Split` שמפצל רקורסיבית את המחרוזת על בסיס המפריד (פסיק). הטיפוס `CSVHeaders` מחלץ את השורה הראשונה (הכותרות) ולאחר מכן משתמש ב-`Split` כדי ליצור טאפל (tuple) של מחרוזות הכותרות. ניתן להרחיב זאת כדי לנתח את כל מבנה ה-CSV וליצור ייצוג טיפוסי של הנתונים.

יישומים מעשיים

לטכניקות אלו יש יישומים מעשיים שונים בפיתוח TypeScript:

• ניתוח תצורה (Configuration Parsing): אימות וחילוץ ערכים מקובצי תצורה (למשל, קבצי `.env`). ניתן לוודא שמשתני סביבה ספציפיים קיימים ובעלי הפורמט הנכון לפני שהיישום מתחיל. תארו לעצמכם אימות מפתחות API, מחרוזות התחברות למסד נתונים, או תצורות של feature flags.
• אימות בקשות/תגובות API: הגדרת טיפוסים המייצגים את מבנה בקשות ותגובות ה-API, כדי להבטיח בטיחות טיפוסים בעת אינטראקציה עם שירותים חיצוניים. ניתן לאמת את הפורמט של תאריכים, מטבעות או סוגי נתונים ספציפיים אחרים המוחזרים מה-API. זה שימושי במיוחד בעבודה עם REST APIs.
• שפות ייעודיות לתחום (DSLs) מבוססות מחרוזות: יצירת DSLs בטוחים מבחינת טיפוסים למשימות ספציפיות, כגון הגדרת כללי עיצוב או סכמות לאימות נתונים. זה יכול לשפר את קריאות הקוד ואת התחזוקתיות שלו.
• יצירת קוד (Code Generation): יצירת קוד המבוסס על תבניות מחרוזת, תוך הבטחה שהקוד שנוצר נכון מבחינה תחבירית. זה נפוץ בשימוש בכלי עזר ובתהליכי בנייה (build).
• המרת נתונים (Data Transformation): המרת נתונים בין פורמטים שונים (למשל, camel case ל-snake case, JSON ל-XML).

שקלו יישום מסחר אלקטרוני גלובלי. תוכלו להשתמש בטיפוסי Template Literal כדי לאמת ולעצב קודי מטבעות בהתבסס על אזור המשתמש. לדוגמה:

            type CurrencyCode = "USD" | "EUR" | "JPY" | "GBP";

type LocalizedPrice<Currency extends CurrencyCode, Amount extends number> = `${Currency} ${Amount}`;

type USPrice = LocalizedPrice<"USD", 99.99>; // Type is "USD 99.99"

//Example of validation
type IsValidCurrencyCode<T extends string> = T extends CurrencyCode ? T : never;

type ValidCode = IsValidCurrencyCode<"EUR"> // Type is "EUR"
type InvalidCode = IsValidCurrencyCode<"XYZ"> // Type is never

            

              
                Copy
              
            
          

דוגמה זו מדגימה כיצד ליצור ייצוג בטוח מבחינת טיפוסים של מחירים מותאמים מקומית ולאמת קודי מטבעות, ובכך לספק הבטחות בזמן קומפילציה לגבי נכונות הנתונים.

יתרונות השימוש בקומבינטורי פרסור

• בטיחות טיפוסים (Type Safety): מבטיח שמניפולציות על מחרוזות הן בטוחות מבחינת טיפוסים, ובכך מפחית את הסיכון לשגיאות זמן ריצה.
• שימוש חוזר (Reusability): קומבינטורי פרסור הם אבני בניין הניתנות לשימוש חוזר שניתן לשלבן כדי לטפל במשימות ניתוח מורכבות יותר.
• קריאות (Readability): האופי המודולרי של קומבינטורי פרסור יכול לשפר את קריאות הקוד ואת התחזוקתיות שלו.
• אימות בזמן קומפילציה: האימות מתרחש בזמן קומפילציה, מה שמאפשר לתפוס שגיאות בשלב מוקדם בתהליך הפיתוח.

מגבלות

• מורכבות: בניית פרסורים מורכבים יכולה להיות מאתגרת ודורשת הבנה מעמיקה של מערכת הטיפוסים של TypeScript.
• ביצועים: חישובים ברמת הטיפוסים יכולים להיות איטיים, במיוחד עבור טיפוסים מורכבים מאוד.
• הודעות שגיאה: הודעות השגיאה של TypeScript עבור שגיאות טיפוסים מורכבות יכולות לפעמים להיות קשות לפענוח.
• יכולת ביטוי (Expressiveness): למרות עוצמתה, למערכת הטיפוסים של TypeScript יש מגבלות ביכולתה לבטא סוגים מסוימים של מניפולציות מחרוזות (למשל, תמיכה מלאה בביטויים רגולריים). תרחישי ניתוח מורכבים יותר עשויים להתאים יותר לספריות ניתוח בזמן ריצה.

מסקנה

טיפוסי ה-Template Literal של TypeScript, בשילוב עם טיפוסים מותנים והסקת טיפוסים, מספקים ערכת כלים רבת עוצמה למניפולציה וניתוח של טיפוסי מחרוזות בזמן קומפילציה. קומבינטורי פרסור מציעים גישה מובנית לבניית פרסורים מורכבים ברמת הטיפוס, ומאפשרים אימות והמרת טיפוסים חזקים בפרויקטים שלכם ב-TypeScript. אמנם ישנן מגבלות, אך היתרונות של בטיחות טיפוסים, שימוש חוזר ואימות בזמן קומפילציה הופכים טכניקה זו לתוספת חשובה לארסנל הכלים שלכם ב-TypeScript.

על ידי שליטה בטכניקות אלו, תוכלו ליצור יישומים חזקים, בטוחים יותר מבחינת טיפוסים ונוחים יותר לתחזוקה, הממנפים את מלוא העוצמה של מערכת הטיפוסים של TypeScript. זכרו לשקול את היתרונות והחסרונות בין מורכבות לביצועים כאשר אתם מחליטים אם להשתמש בניתוח ברמת הטיפוס לעומת ניתוח בזמן ריצה לצרכים הספציפיים שלכם.

גישה זו מאפשרת למפתחים להעביר את זיהוי השגיאות לזמן הקומפילציה, מה שמוביל ליישומים צפויים ואמינים יותר. חשבו על ההשלכות שיש לכך על מערכות בינלאומיות - אימות קודי מדינה, קודי שפה ופורמטים של תאריכים בזמן קומפילציה יכול להפחית באופן משמעותי באגים הקשורים ללוקליזציה ולשפר את חווית המשתמש עבור קהל גלובלי.

להמשך קריאה ומחקר

• חקרו טכניקות מתקדמות יותר של קומבינטורי פרסור, כגון backtracking ושחזור שגיאות.
• בדקו ספריות המספקות קומבינטורי פרסור מוכנים מראש עבור טיפוסים של TypeScript.
• התנסו בשימוש בטיפוסי Template Literal ליצירת קוד ולמקרי שימוש מתקדמים אחרים.
• תרמו לפרויקטי קוד פתוח המשתמשים בטכניקות אלו.

על ידי למידה והתנסות מתמדת, תוכלו למצות את מלוא הפוטנציאל של מערכת הטיפוסים של TypeScript ולבנות יישומים מתוחכמים ואמינים יותר.